<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="renderer" content="webkit" />
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
  <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
  <script src="<%= BASE_URL %>config/config.js"></script>
  <title>
    <%= webpackConfig.name %>
  </title>
  <script>

    /*
       * 判断360w
       */
    function ua360_mime (option, value) {
      var mimeTypes = navigator.mimeTypes;
      for (var mt in mimeTypes) {
        if (mimeTypes[mt][option] === value) {
          return true;
        }
      }
      return false;
    }
    /*
     * 获取IE浏览器版本
     */

    function getIeVersion () {
      var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
      var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器
      var isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //判断是否IE的Edge浏览器
      var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
      if (isIE) {
        var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
        reIE.test(userAgent);
        var fIEVersion = parseFloat(RegExp["$1"]);
        return fIEVersion;
      } else if (isEdge) {
        return 'edge';//edge
      } else if (isIE11) {
        return 11; //IE11
      } else {
        return -1;//不是ie浏览器
      }
    }
    /*
     * 获取oper浏览器版本
     */
    function getOperaVersion (userAgent) {
      try {
        if (window.opera) {
          return userAgent.match(/opera.([\d.]+)/)[1];
        } else if (userAgent.indexOf("opr") > 0) {
          return userAgent.match(/opr\/([\d.]+)/)[1];
        }
      } catch (e) {
        return 0;
      }
    }

    /*
     * 判断是否为360浏览器
     */
    function validate360 (option, value) {
      var mimeTypes = window.navigator.mimeTypes;
      for (var mt in mimeTypes) {
        // console.log(mimeTypes[mt][option]);
        if (mimeTypes[mt][option] == value) {
          return true;
        }
      }
      return false;
    }

    function GetCurrentBrowser () {
      var ua = navigator.userAgent.toLocaleLowerCase();
      // console.log("ua: ", ua);
      var browserType = null;
      if (ua.match(/msie/) != null || ua.match(/trident/) != null) {
        browserType = "IE";
        var ie = getIeVersion();
        // console.log("ie : ", ie);
      } else if (ua.match(/firefox/) != null) {
        browserType = "firefox";
      } else if (ua.match(/ucbrowser/) != null) {
        browserType = "UC";
      } else if (ua.match(/opera/) != null || ua.match(/opr/) != null) {
        browserType = "opera";
        var opera = getOperaVersion();
        // console.log("opera: ", opera);
      } else if (ua.match(/bidubrowser/) != null) {
        browserType = "baidu";
      } else if (ua.match(/metasr/) != null) {
        browserType = "sougou";
      } else if (
        ua.match(/tencenttraveler/) != null ||
        ua.match(/qqbrowse/) != null
      ) {
        browserType = "QQ";
      } else if (ua.match(/maxthon/) != null) {
        browserType = "maxthon";
      } else if (ua.match(/chrome/) != null) {
        var is360 = ua360_mime("type", "application/vnd.chromium.remoting-viewer");
        if (is360) {
          browserType = "360";
          var a360 = validate360();
          // console.log("a360: ", a360);
        } else {
          browserType = "chrome";
        }
      } else if (ua.match(/safari/) != null) {
        browserType = "Safari";
      } else {
        browserType = "others";
      }
      return browserType;
    }
    var UA = GetCurrentBrowser();
    // console.log("浏览器型号", UA);
    // if (a.toLowerCase().indexOf("ie") > -1) {
    //   window.location.href = "/html/ie.html";
    // }
    // ie9版本以下的提示
    (function () {
      var ua = navigator.userAgent.toLocaleLowerCase();
      if (ua.match(/msie/) != null || ua.match(/trident/) != null) {
        // window.location.href = "/html/ie.html";
        window.location.href = city_name == 'dwdt' ? '/wycms/html/ie.html' : "/html/ie.html";
      }
    })();
  </script>
  <style>
    html,
    body,
    #app {
      height: 100%;
      margin: 0px;
      padding: 0px;
    }

    .chromeframe {
      margin: 0.2em 0;
      background: #ccc;
      color: #000;
      padding: 0.2em 0;
    }

    #loader-wrapper {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 999999;
    }

    #loader {
      display: block;
      position: relative;
      left: 50%;
      top: 50%;
      width: 150px;
      height: 150px;
      margin: -75px 0 0 -75px;
      border-radius: 50%;
      border: 3px solid transparent;
      border-top-color: #fff;
      -webkit-animation: spin 2s linear infinite;
      -ms-animation: spin 2s linear infinite;
      -moz-animation: spin 2s linear infinite;
      -o-animation: spin 2s linear infinite;
      animation: spin 2s linear infinite;
      z-index: 1001;
    }

    #loader:before {
      content: "";
      position: absolute;
      top: 5px;
      left: 5px;
      right: 5px;
      bottom: 5px;
      border-radius: 50%;
      border: 3px solid transparent;
      border-top-color: #fff;
      -webkit-animation: spin 3s linear infinite;
      -moz-animation: spin 3s linear infinite;
      -o-animation: spin 3s linear infinite;
      -ms-animation: spin 3s linear infinite;
      animation: spin 3s linear infinite;
    }

    #loader:after {
      content: "";
      position: absolute;
      top: 15px;
      left: 15px;
      right: 15px;
      bottom: 15px;
      border-radius: 50%;
      border: 3px solid transparent;
      border-top-color: #fff;
      -moz-animation: spin 1.5s linear infinite;
      -o-animation: spin 1.5s linear infinite;
      -ms-animation: spin 1.5s linear infinite;
      -webkit-animation: spin 1.5s linear infinite;
      animation: spin 1.5s linear infinite;
    }

    @-webkit-keyframes spin {
      0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
      }

      100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
      }
    }

    @keyframes spin {
      0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
      }

      100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
      }
    }

    #loader-wrapper .loader-section {
      position: fixed;
      top: 0;
      width: 51%;
      height: 100%;
      background: #7171c6;
      z-index: 1000;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0);
    }

    #loader-wrapper .loader-section.section-left {
      left: 0;
    }

    #loader-wrapper .loader-section.section-right {
      right: 0;
    }

    .loaded #loader-wrapper .loader-section.section-left {
      -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
      transform: translateX(-100%);
      -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    }

    .loaded #loader-wrapper .loader-section.section-right {
      -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
      transform: translateX(100%);
      -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    }

    .loaded #loader {
      opacity: 0;
      -webkit-transition: all 0.3s ease-out;
      transition: all 0.3s ease-out;
    }

    .loaded #loader-wrapper {
      visibility: hidden;
      -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
      transform: translateY(-100%);
      -webkit-transition: all 0.3s 1s ease-out;
      transition: all 0.3s 1s ease-out;
    }

    .no-js #loader-wrapper {
      display: none;
    }

    .no-js h1 {
      color: #222222;
    }

    #loader-wrapper .load_title {
      font-family: "Open Sans";
      color: #fff;
      font-size: 19px;
      width: 100%;
      text-align: center;
      z-index: 9999999999999;
      position: absolute;
      top: 60%;
      opacity: 1;
      line-height: 30px;
    }

    #loader-wrapper .load_title span {
      font-weight: normal;
      font-style: italic;
      font-size: 13px;
      color: #fff;
      opacity: 0.5;
    }

  </style>
</head>

<body>
  <div id="app">
    <div id="loader-wrapper">
      <div id="loader"></div>
      <div class="loader-section section-left"></div>
      <div class="loader-section section-right"></div>
      <div class="load_title">正在加载系统资源，请耐心等待</div>
    </div>
  </div>
</body>

</html>
